import { computed, h, reactive, ref } from "vue";
import { NButton, NSpace, NTag } from "naive-ui";
import { Layer } from "slash-layer";
import form from "./SysOperateLogUpdate.vue";
import httpApi from "./httpApi";
import { RowData } from "naive-ui/es/data-table/src/interface";

/**
 * 视图控制
 */
export const vCtl = reactive({
  addBtn: computed(() => {
    return true;
  }),
  updateBtn: computed(() => {
    return true && checkedRows.value.length == 1;
  }),
  delBtn: computed(() => {
    return true && checkedRows.value.length >= 1;
  })

});
export const initQuery = {};
export const queryForm = ref<any>(JSON.parse(JSON.stringify(initQuery)));
export const tableRef = ref<any>();

export function reloadTable() {
  if (tableRef.value) {
    tableRef.value.reload();
  }

}

/**
 * 选中的数据
 */
export const checkedRows = ref<any>([]);

/**
 * 选中行
 * @param rows
 */
export async function onCheckedRowEvent(rows: any[]) {
  checkedRows.value = rows;
}

/**
 * 枚举字段
 */
export const bizSuccessTextEnum = reactive(
  {
    1: {
      text: "成功",
      style: "success"
    },
    0: {
      text: "失败",
      style: "error"
    }
  }
);
/**
 * 枚举字段 0查询，1新增，2修改，3删除，4导出，5导入，6其他 12新增或修改
 */
export const bizTypeTextEnum = reactive(
  {
    12: {
      text: "新增或修改",
      style: "info"
    },
    6: {
      text: "其他",
      style: "error"
    },
    5: {
      text: "导入",
      style: "warning"
    },
    4: {
      text: "导出",
      style: "warning"
    },
    3: {
      text: "删除",
      style: "error"
    },
    2: {
      text: "修改",
      style: "info"
    },
    1: {
      text: "新增",
      style: "info"
    },
    0: {
      text: "查询",
      style: "default"
    }
  }
);

export const queryItemList = [
  {
    title: '操作类型',
    key: 'type',
    searchProps: {
      type: 'select',
    },
  },
  {
    title: '状态',
    key: 'isSuccess',
    searchProps: {
      type: 'select',
    },
  },
  {
    title: '操作地址',
    key: 'uri',
    searchProps: {
      type: 'text',
    },
  },
  {
    title: '操作序列号',
    key: 'requestSeq',
    searchProps: {
      type: 'text',
    },
  },
  
  {
    title: '创建时间',
    key: 'createTime',
    searchProps: {
      type: 'date-range',
      more: true
    },
  },
  {
    title: '操作方法',
    key: 'operateMethodName',
    searchProps: {
      type: 'text',
      more: true
    },
  },
  {
    title: '类名',
    key: 'operateMethodClassName',
    searchProps: {
      type: 'text',
      more: true
    },
  },
  {
    title: 'IP地址',
    key: 'operateIp',
    searchProps: {
      type: 'text',
      more: true
    },
  },
  {
    title: '类别名称',
    key: 'categoryName',
    searchProps: {
      type: 'text',
      more: true
    },
  }
]

/**
 * 更新弹框
 * @param row
 */
export async function doUpdateModal(row: any) {
  if (checkedRows.value.length != 1 && !row) {
    Layer.error("请选择数据条目后操作");
    return;
  }
  if (!row) {
    row = {
      id: checkedRows.value[0]
    };
  }
  await Layer.updateForm({
    title: "编辑",
    content: {
      component: form,
      props: { ...row }
    }
  } as any);
}

/**
 * 新增
 * @param row
 */
export async function doSaveModal(row: any) {
  console.log("传递的数据:{}", row);
  await Layer.createForm({
    title: "新增",
    content: {
      component: form,
      props: {}
    }
  } as any);
  await reloadTable();
}

/**
 * 删除
 * @param row
 */
export async function doDeleteModal(row: any) {
  let ids: any = [];
  if (!row) {
    ids = [...checkedRows.value];
  }
  if (row) {
    ids.push(row.id);
  }

  if (ids.length == 0) {
    Layer.error("请选择要删除的数据条目");
    return;
  }
  await Layer.confirm("您确定删除选中记录么");
  await httpApi.doLogicDeleteEntity(ids);
  await reloadTable();
}

/**
 * 查看表单
 * @param row
 */
export async function doReadModal(row: any) {
  if (checkedRows.value.length != 1 && !row) {
    Layer.error("请选择数据条目后操作");
    return;
  }
  if (!row) {
    row = {
      id: checkedRows.value[0]
    };
  }
  await Layer.readForm({
    title: "查看",
    content: {
      component: form,
      props: { ...row }
    }
  } as any);
  await reloadTable();

}

/**
 * 列表页面列
 */
export const tableColumns = [
  {
    title: "选中",
    key: "id",
    type: "selection",
    fixed: "left",
    width: 50,
    disabled(row: any) {
      return row.name === "Edward King 3";
    }
  },
  {
    title: "操作序列号",
    key: "requestSeq",
    sorter: "requestSeq",
    width: 150
  },
  {
    title: "账号",
    key: "createUserAccount",
    sorter: "createUserAccount",
    width: 150
  },
  // {
  //   title: "用户名",
  //   key: "username",
  //   sorter: "username",
  //   width: 150
  // },
  {
    title: "操作方法",
    key: "operateMethodName",
    sorter: "operateMethodName",
    width: 150
  },
  {
    title: "操作内容",
    key: "operateContent",
    sorter: "operateContent",
    width: 150
  },
  {
    title: "操作IP",
    key: "operateIp",
    sorter: "operateIp",
    width: 150
  },

  {
    title: "类型",
    key: "type",
    sorter: "type",
    width: 150,
    render(row: RowData) {
      return h(NTag, {
        type: bizTypeTextEnum[row.type].style
      }, bizTypeTextEnum[row.type].text);
    }
  },


  {
    title: "状态",
    key: "isSuccess",
    sorter: "isSuccess",
    width: 150,
    render(row: RowData) {
      return h(NTag, {
        type: bizSuccessTextEnum[row.isSuccess] ? bizSuccessTextEnum[row.isSuccess].style : ""
      }, bizSuccessTextEnum[row.isSuccess] ? bizSuccessTextEnum[row.isSuccess].text : "未知");
    }
  },
  {
    title: "耗时(MS)",
    key: "takeUpTime",
    sorter: "takeUpTime",
    width: 100
  },
  {
    title: "创建时间",
    key: "createTime",
    width: 160,
    sorter: "createTime"
  },
  // {
  //   title: "操作",
  //   key: "id",
  //   type: "id",
  //   fixed: "right",
  //   width: 160,
  //   render: function(row: any) {
  //     return h(NSpace, [
  //       h(NButton, {
  //         onVnodeMounted: async (vNode: any) => {
  //           //await checkAuthShow(vNode.el as any, "1P76CZFAXE");
  //         },
  //         type: "primary",
  //         text: true,
  //         onClick: (async (row: any) => {
  //           await doReadModal(row);
  //         }).bind(null, row)
  //       }, "查看详情")
  //       // h(NButton, {
  //       //   onVnodeMounted: async (vNode: any) => {
  //       //     // await checkAuthShow(vNode.el as any, "HT4UR87SIB");
  //       //   },
  //       //   type: "primary",
  //       //   text: true,
  //       //   onClick: (async (row: any) => {
  //       //     await doDeleteModal(row);
  //       //   }).bind(null, row)
  //       // }, "删除")
  //     ]);
  //   }
  // }
];
/**
 * 新增和更新校验规则
 */
export const formRules = reactive({
    fkUserAccount: [{ required: true, message: "请输入", trigger: "blur" }],
    fkUsername: [{ required: true, message: "请输入", trigger: "blur" }],
    operateMethodName: [{ required: true, message: "请输入", trigger: "blur" }],
    operateMethodClassName: [{ required: true, message: "请输入", trigger: "blur" }],
    operateIp: [{ required: true, message: "请输入", trigger: "blur" }],
    categoryName: [{ required: true, message: "请输入", trigger: "blur" }],
    type: [{ required: true, message: "请输入0查询，1新增，2修改，3删除，4导出，5导入，6其他 12新增或修改", trigger: "blur" }],
    operateContent: [{ required: true, message: "请输入", trigger: "blur" }],
    isSuccess: [{ required: true, message: "请输入", trigger: "blur" }],
    uri: [{ required: true, message: "请输入操作地址", trigger: "blur" }],
    requestSeq: [{ required: true, message: "请输入操作序列号", trigger: "blur" }],
    errorLog: [{ required: true, message: "请输入错误日志记录", trigger: "blur" }],
    requestParameters: [{ required: true, message: "请输入请求参数", trigger: "blur" }],
    responseParameters: [{ required: true, message: "请输入响应参数", trigger: "blur" }]
  })
;

